<template>
	<slot v-if="promiseInject" :data="dataList"></slot>
</template>

<script lang="ts" setup>
import { onBeforeMount, ref, watch, inject, computed } from "vue";
import { promiseInjectionKey } from "../help";

const props = withDefaults(
	defineProps<{
		value?: any[];
		deep?: boolean;
	}>(),
	{
		value: () => [],
		deep: false,
	},
);

const originalList = ref<any>([]);
const promise = inject(promiseInjectionKey);

const dataList = computed(() => originalList.value.result);
const promiseInject = computed(() => promise?.result);

watch(
	() => props.value,
	value => {
		originalList.value = originalList.value.concat(value);
	},
	{
		deep: props.deep,
	},
);

onBeforeMount(() => {
	originalList.value = originalList.value.concat(props.value);
});
</script>
